<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html >
 <%@include file="./resource/head.jsp" %> 
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>创建游戏</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

  </head>
  <body ng-app="app" class=" werewolf" ng-controller="game">
  	<nav class="navbar navbar-default">
	    <div class="navbar-header">
	      <a class="navbar-brand" href="#">
	        <img alt="狼人杀" src="">
	      </a>
	    </div>
	</nav>
	<div class="container">
	  	<page class="row active" id="config">
				<addgame class="col-xs-12 form-horizontal">
			  		<!-- 名称 -->
			  		<label for="config">配置</label>
			  		<div class="form-group">
						<label class="col-xs-2 control-label">狼人</label>
						<div class="col-xs-10">
							<input type="number" class="form-control" placeholder="狼人数量..." id="wolf" ng-model="wolf">	
						</div>
					</div>
			  		<div class="form-group">
						<label class="col-xs-2 control-label">平民</label>
						<div class="col-xs-10">
							<input type="number" class="form-control" placeholder="平民数量..." id="citizen" ng-model="citizen">
						</div>
					</div>
			  		<div class="form-group">
						<label class="col-xs-3 control-label">预言家</label>
						<div class="col-xs-1">
							<input type="checkbox" class="checkbox" id="foresee" ng-model="forsee">
						</div>
						
						<label class="col-xs-3 control-label">猎人</label>
						<div class="col-xs-1">
							<input type="checkbox" class="checkbox" id="hunter" ng-model="hunter">
						</div>
						<label class="col-xs-3 control-label">女巫</label>
						<div class="col-xs-1">
							<input type="checkbox" class="checkbox" id="witch" ng-model="witch">
						</div>
					</div>
					<div class="form-group">
						<label class="col-xs-3 control-label">守卫</label>
						<div class="col-xs-1">
							<input type="checkbox" class="checkbox" id="guard" ng-model="guard">
						</div>
						<label class="col-xs-3 control-label">白痴</label>
						<div class="col-xs-1">
							<input type="checkbox" class="checkbox" id="idiot" ng-model="idiot">
						</div>
					</div>
					<!-- 提交 -->		
			  		<div class="form-group">	
			  			<div class="col-xs-offset-2 col-xs-10">
			  				<button class="btn btn-primary" ng-click="start()">开始游戏</button>
			  			</div>	
			  		</div>
				</addgame>
	  	</page>
	  	<page class="row" id="init">
	  	<div class="col-xs-12" >
	  		<label>游戏人数：</label>{{number}}
	  		<div class="form-horizontal">
	  			<label class="control-label">{{nowNumber}}号玩家</label>
	  			<div class="form-group">
					<label class="col-xs-2 control-label">昵称</label>
					<div class="col-xs-10">
						<input type="text" class="form-control" placeholder="输入姓名" ng-model="player">
					</div>
				</div>
				<div class="form-group">
					<label class="col-xs-2 control-label">角色</label>
					<div class="col-xs-10">
						<select name="role" id="" class="form-control" ng-model="role">
							<option value="wolf">狼人</option>
							<option value="citizen">平民</option>
							<option value="forsee" ng-if="forsee==true">预言家</option>
							<option value="hunter" ng-if="hunter==true">猎人</option>
							<option value="idiot" ng-if="idiot==true">白痴</option>
							<option value="witch" ng-if="witch==true">女巫</option>
							<option value="guard" ng-if="guard==true">守卫</option>
						</select>
					</div>
				</div>
				<button ng-click="next();" class="btn btn-primary" ng-disabled="player==''||player==null||role==null||role==''">下一位</button>
	  		</div>
	  	</div>
	  	</page>
	  	<page class="row" id="wolf">
	  	<div class="col-xs-12" >
	  		<label for="" class="col-xs-12">狼人请杀人</label>
	  		<div class="col-xs-4" ng-repeat="one in playerList">
	  			<button class="{{one.out==true?'btn btn-danger':'btn btn-info'}}" ng-click="kill(one)" ng-disabled="one.out==true">{{one.number}}号玩家,{{one.name}}</button>
	  		</div>
	  	</div>
	  	</page>
	  	<page class="row" id="witch">
	  	<div class="col-xs-12" >
	  		<div class="panel panel-default">
	  			<div class="panel-heading">女巫</div>
	  			<div class="panel-body">
	  				<label for="" class="col-xs-12" ng-if="rWitch.h==true">
			  			今晚【{{personDead.number}}号:{{personDead.name}}】死了要救吗？
			  		</label>
			  		<div class="col-xs-12" ng-if="rWitch.h==true">
			  			<button class="btn btn-info" ng-click="heal(true);">救</button>
			  		</div>
					
			  		<label for="" class="col-xs-12" ng-if="rWitch.k==true">
			  			你想毒谁
			  		</label>
			  		<div class=col-xs-4 ng-repeat="one in playerList" ng-if="rWitch.k==true">
			  			<button class="{{one.out==true?'btn btn-danger':'btn btn-info'}}" ng-click="witchkill(one)"  ng-disabled="one.out==true">{{one.number}}号玩家,{{one.name}}</button>
			  		</div>
			  		<label for="" class="col-xs-12">
			  			我什么都不想做
			  		</label>
			  		<div class="col-xs-4" > 
			  			<button class="btn btn-info" ng-click="witchnext()">什么都不做</button>
			  		</div>
	  			</div>
	  		</div>
	  	</div>
	  	</page>
	  	<page class="row" id="forsee">
	  	<div class="col-xs-12" >
	  		<label for="" class="col-xs-12">预言家请验人</label>
	  		<div class="col-xs-4" ng-repeat="one in playerList">
	  			<button class="{{one.out==true?'btn btn-danger':'btn btn-info'}}" ng-click="see(one)"  ng-disabled="one.out">{{one.number}}号玩家,{{one.name}}</button>
	  		</div>
	  	</div>
	  	</page>
	  	<page class="row" id="result">
	  	<div class="col-xs-12" >
	  		<row class="row">
		  		<button ng-click="cgw();" class="btn btn-success">公布结果</button>
			  	<button ng-click="night();" class="btn btn-primary">天黑请闭眼</button>
		  	</row>
		  	<row class="row">
		  		<h3>
			  		{{godword}}
			  	</h3>
		  	</row>
		  	<row class="row">
		  		<label for="" class="col-xs-12">白天投票or猎人杀人</label>
	  		</row>
	  		<row class="row">
		  		<div class="col-xs-4" ng-repeat="one in playerList">
		  			<button class="{{one.out==true?'btn btn-danger':'btn btn-info'}}" ng-click="vote(one)"  ng-disabled="one.out">{{one.number}}号玩家,{{one.name}}</button>
		  		</div>
	  		</row>
	  	</div>
	  	</page>
  	</div>
  </body>
  <%@include file="./resource/foot.jsp" %>  
  <script>
  var module=angular.module("app",[]);
  var gameList=module.controller("game",function($scope){
	  //流程
	  var config={"id":"config"};
	  var init={"id":"init"};
	  var wolf={"id":"wolf"};
	  var witch={"id":"witch"};
	  var forsee={"id":"forsee"};
	  var guard={"id":"guard"};
	  var result={"id":"result"};
	  config.next=init;
	  init.next=wolf;
	  wolf.next=witch;
	  witch.next=forsee;
	  forsee.next=result;
	  result.next=wolf;
	  //数据
	  $scope.playerList=[];
	  $scope.result=[];	//当天死亡结果
	  $scope.nowNumber=1;
	  $scope.forsee=true;
	  $scope.witch=true;
	  //游戏开始
	  $scope.start=function(){
		$scope.number=$scope.wolf+$scope.citizen+
						($scope.forsee==true?1:0)+
						($scope.hunter==true?1:0)+
						($scope.witch==true?1:0)+
						($scope.guard==true?1:0)+
						($scope.idiot==true?1:0);
		nextpage(config);
	  }
	  //输入用户，下一步
	  $scope.next=function(){
		  var temp={
					number:$scope.nowNumber,
					name:$scope.player,
					role:$scope.role
				};
		  //如果是女巫
		  if($scope.role=="witch"){
			  temp.h=true;
			  temp.k=true;
			  $scope.rWitch=temp;
		  }
		  //如果是预言家
		  if($scope.role=="forsee"){
			  $scope.rForsee=temp;
		  }
		  $scope.playerList.push(temp);
		  //如果后面还有玩家
		  if($scope.nowNumber<$scope.number){
			  $scope.nowNumber++;
		  }else{
			  console.log($scope.playerList);
			  var msg=validate();
			  if(msg==true){
				  alert("游戏开始");
				  nextpage(init);
			  }else{
				  alert(msg+",请重新输入信息");
				  $scope.playerList=[];
				  $scope.nowNumber=1;
			  }
		  }
		  $scope.player="";
		  $scope.role="";
	  }
	  //验证配置
	  var validate=function(){
		  var wolf=0,citizen=0,forsee=false,witch=false,hunter=false,guard=false,idiot=false;
		  var msg=true;
		  for(var i=0;i<$scope.playerList.length;i++){
			  var temp=$scope.playerList[i];
			  if(temp.role=="wolf"){
				  wolf++
			  }else if(temp.role=="citizen"){
				  citizen++;
			  }else if(temp.role=="forsee"){
				  if(!forsee){
					  forsee=true;
				  }else{
					  msg="有多个预言家";
					  break;
				  }
			  }else if(temp.role=="witch"){
				  if(!witch){
					  witch=true;
				  }else{
					  msg="有多个女巫";
					  break;
				  }
			  }else if(temp.role=="hunter"){
				  if(!hunter){
					  hunter=true;
				  }else{
					  msg="有多个猎人";
					  break;
				  }
			  }else if(temp.role=="guard"){
				  if(!guard){
					  guard=true;
				  }else{
					  msg="有多个守卫";
					  break;
				  }
			  }else if(temp.role=="idiot"){
				  if(!idiot){
					  idiot=true;
				  }else{
					  msg="有多个白痴";
					  break;
				  }
			  }
		  }
		  //验证狼人数量
		  if(wolf!=$scope.wolf){
			  msg="狼人数量不正确";
		  }
		  //验证村民数量
		  if(citizen!=$scope.citizen){
			  msg="村民数量不正确";
		  }
		  return msg;
	  }
	  //狼人杀人
	  $scope.kill=function(person){
		  if(window.confirm('你确定要杀'+person.number+'号'+person.name+'吗？')){
              //alert("确定");
           }else{
              //alert("取消");
              return false;
          }
		  person.dead=true;
		  $scope.personDead=person;
		  nextpage(wolf);
	  }
	  //女巫救人
	  $scope.heal=function(heal){
		  if(window.confirm('确定要救他吗？')){
			  if($scope.rWitch.out==true){
				  alert("对不起你已经死了，不能使用解药。");
				  return false;
			  }
			  if($scope.rWitch.dead==true){
				  alert("对不起,女巫不能自救。");
				  return false;
			  }
           }else{
              //alert("取消");
              return false;
          }
		  if(heal){
			  $scope.personDead.dead=false;
			  $scope.rWitch.h=false;
		  }
		  nextpage(witch);
	  }
	  //女巫毒人
	  $scope.witchkill=function(person){
		  if(window.confirm('确定要毒'+person.number+'号'+person.name+'吗？')){
			  if($scope.rWitch.out==true){
				  alert("对不起你已经死了，不能使用毒药。");
				  return false;
			  }
           }else{
              //alert("取消");
              return false;
          }
		  person.dead=true;
		  person.poison=true;
		  $scope.rWitch.k=false;
		  nextpage(witch);
	  }
	  //女巫下一步
	  $scope.witchnext=function(){
		  if(window.confirm('是否什么都不做，跳过下一步？')){
              //alert("确定");
			  
           }else{
              //alert("取消");
              return false;
          }
		  nextpage(witch);
	  }
	  //预言家验人
	  $scope.see=function(person){
		  if(window.confirm('确定要验'+person.number+'号'+person.name+'吗？')){
              //alert("确定");
			  
           }else{
              //alert("取消");
              return false;
          }
		  var msg=person.number+"号玩家"+person.name+"是";
		  if(person.role=="wolf"){
			  msg+="狼人";
		  }else{
			  msg+="好人";
		  }
		  alert(msg);
		  nextpage(forsee);
	  }
	  //生成上帝的话
	  $scope.cgw=function(){
		  var msg="今晚";
		  //循环遍历死亡
		  for(var i=0;i<$scope.playerList.length;i++){
			  var one=$scope.playerList[i];
			  //如果已经出局则跳过
			  if(one.out==true)continue;
			  if(one.dead==true){
				  $scope.result.push(one);
			  }
		  }
		  if($scope.result.length>0){
			  var hunter=true;
			  //查看结果
			  for(var i=0;i< $scope.result.length;i++){ 
				  var one=$scope.result[i];
				  one.out=true;
				  msg+="【"+one.number+"号"+one.name+"】"
				  if(one.role=="hunter"&&one.poison==true)hunter=false;
			  }
			  msg+="死了。";
			  if(hunter){
				  msg+="猎人可以发动技能";
			  }else{
				  msg+="猎人不能发动技能";
			  }
		  }else{
			  msg+="平安夜。"
		  }
		  $scope.godword=msg;
	  }
	  //白天死人，投票or猎人
	  $scope.vote=function(person){
		  if(window.confirm('确定要杀死'+person.number+'号'+person.name+'吗？')){
	          //alert("确定");
			  
			}else{
				//alert("取消");
				return false;
			}
		  person.dead=true;
		  person.out=true;
		  
	  }
	  //天黑请闭眼
	  $scope.night=function(){
		  if(window.confirm('确定要进进入黑夜吗？')){
          //alert("确定");
		  
		      }else{
		         //alert("取消");
		         return false;
		     }
		  $scope.result=[];
		  $scope.godword="";
		  nextpage(result);
	  }
	  //翻页
	  var nextpage=function(current){
		  var next=current.next;
		  $("page#"+current.id).removeClass("active");
		  $("page#"+next.id).addClass("active");
	  }
  });
  
  </script>
</html>
